<template>
  <view>
    <uni-grid-item>
      <view @click="handle_WDXX_click" class="grid-item-box">
        <uni-icons type="notification" size="30"></uni-icons>
        <text class="text">我的消息</text>
        <view class="grid-dot">
          <uni-badge
            style="
              position: absolute;
              top: 20rpx;
              right: 20rpx;
              font-size: 16px;
            "
            :text="noReadCount"
          >
          </uni-badge>
        </view>
      </view>
    </uni-grid-item>
  </view>
</template>

<script>
import { mapActions, mapGetters } from "vuex";
export default {
  name: "WoDeXiaoXi_module",
  data() {
    return {};
  },
  mounted() {
    this.fetchDeviceEvents();
  },
  computed: {
    ...mapGetters(["noReadCount"]),
  },
  methods: {
    ...mapActions(["fetchDeviceEvents", "addReadEvents"]),
    handle_WDXX_click() {
      this.$tab.navigateTo("/pages/WoDeXiaoXi/index");
    },
  },
};
</script>

<style lang="scss" scoped>
.text {
  font-size: 14px;
  margin-top: 5px;
}

.grid-item-box {
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 15px 0;
}
</style>